/**
 * Created by zhouli on 18/1/30
 * Email li.zhou@huilianyi.com
 * 组织架构树显示到人
 */
import React from 'react';
import {Tree, Icon} from 'antd';
import 'styles/components/template/select-depment-or-person/dep-tree-with-person.scss';
const TreeNode = Tree.TreeNode;
class DepTreeWithPerson extends React.Component {
  constructor(props) {
    super(props);
    this.state = {}
  }
  // 渲染部门节点标题
  // 添加title属性并修改显示样式为标题超长省略号 修改人：陈行健 lavi.chen@huilianyi.com
  renderTreeNodesTitle = (item) => {
    if (item.type === "DEP") {
      return (<div title={item.title}><Icon type="folder"/> &nbsp;<span className='org-dep-node-title'>
                {item.title}
                </span></div>)
    } else {
      return (<div title={item.title}><Icon type="user"/> &nbsp;<span className='org-dep-node-title'>
                {item.title}
                </span></div>)
    }
  }
  // 渲染部门节点
  renderTreeNodes = (data) => {
    return data.map((item) => {
      if (item.children) {
        return (
          <TreeNode
            title={this.renderTreeNodesTitle(item)}
            key={item.key}
            dataRef={item}
            className='org-dep-node'>
            {this.renderTreeNodes(item.children)}
          </TreeNode>
        );
      }
      if (this.props.emptyDepIsDisabled && item.type === "DEP") {
        // 如果是空部门，禁用
        return <TreeNode className='org-dep-node'
                         disabled
                         title={this.renderTreeNodesTitle(item)}
                         key={item.key} dataRef={item}/>
      } else {
        return <TreeNode className='org-dep-node'
                         disabled={item.nodeDisabled}
                         title={this.renderTreeNodesTitle(item)}
                         key={item.key} dataRef={item}/>
      }

    });
  }

  render() {
    const {multiple, selectedKeys, expandedKeys, autoExpandParent, onSelect, onExpand, treeData} = this.props;
    return (
      <div className="org-structure-tree-with-person">
        <Tree
          multiple={multiple}
          selectedKeys={selectedKeys}
          expandedKeys={expandedKeys}
          autoExpandParent={autoExpandParent}
          onSelect={onSelect}
          onExpand={onExpand}
        >
          {this.renderTreeNodes(treeData)}
        </Tree>
      </div>
    )
  }
}

DepTreeWithPerson.propTypes = {
  emptyDepIsDisabled: React.PropTypes.bool.isRequired,//空部门是否禁用
  treeData: React.PropTypes.array.isRequired,//组织架构数据
  selectedKeys: React.PropTypes.array.isRequired,//被选择了的部门oid或者人oid
  expandedKeys: React.PropTypes.array.isRequired,//被展开了的部门
  autoExpandParent: React.PropTypes.bool.isRequired,
  onSelect: React.PropTypes.func.isRequired,// 点击激活某一个部门
  onExpand: React.PropTypes.func.isRequired,// 点击展开某一个部门
};

DepTreeWithPerson.defaultProps = {
  emptyDepIsDisabled: false
};

export default DepTreeWithPerson;

